<template>
  <div>
    <input type="text" v-model.lazy="uname">
  </div>
</template>

<script>
export default {
  data () {
    return {
      uname: 'zhangsan',
      dog:{
        name:'小灶',
        age: 18
      }
    }
  },
  //侦听器，要写到和data平级的watch里面
  watch: {
    //1 函数写法
    // uname(newVal,oldVal){
    //   console.log(newVal,oldVal);
    // }
    // 2 对象写法  (写成对象为了加  immediate 或 deep 选项)
    uname:{
      handler(newVal,oldVal){
        //写对象格式，handler 必须写，名字固定
        console.log(newVal,oldVal);
      },
      immediate: true //加入这个选项，表示立即侦听（打开页面，获取初始值）
    },
    // dog:{
    //   handler (newVal){
    //     console.log(newVal);
    //   },
    //   deep:true  //深度侦听  当对象的任意属性改变后，都会触发该侦听器
    // }

    //只侦听对象中某个属性的变化
    'dog.age' (newVal){
      console.log(newVal);
    }
  }
}
</script>

<style>

</style>